function magnifier() {
    this.box = document.querySelector(".wrap-small-magnifier")
    this.box_img = document.querySelector(".wrap-small-magnifier img")
    this.focus = document.querySelector(".focus")
    this.big = document.querySelector(".wrap-big-magnifier")
    this.big_img = document.querySelector(".wrap-big-magnifier img")
    this.active = document.querySelector(".active")
    this.i = document.querySelectorAll(".wrap-choice-magnifier i")

}
magnifier.prototype.bindevent = function () {
    var data = this
    data.box.onmousemove = function () {
        data.focus.style.display = "block"
        data.big.style.display = "block"
        data.getposition()
    }
    data.box.onmouseout = function () {
        data.focus.style.display = "none"
        data.big.style.display = "none"
    }
    for (let a = 0; a < this.i.length; a++) {
        //var data = this
        data.i[a].onclick = function () {
            data.i[0].className = ""
            data.i[1].className = ""
            this.className = "active"
            //console.log(data.box_img.src)
            switch (a) {
                case '0':
                    data.box_img.src = 'data.i[0].getAttribute("data-small")'
                    data.big_img.src = 'data.i[0].getAttribute("data-big")'
                    break
                case '1':
                    //data.box_img.src = 'data.i[1].getAttribute("data-small")'
                    //data.big_img.src = 'data.i[1].getAttribute("data-big")'
                    data.box_img.setAttribute(src,data.i[1].getAttribute("data-small"))
                    data.big.setAttribute("class","www")
                    break
            }
        }
    }
}
magnifier.prototype.getposition = function (evt) {
    var e = evt || event
    var lef = e.offsetX
    var top = e.offsetY
    //console.log(lef, top)
    this.focusposition(lef, top)
}
magnifier.prototype.focusposition = function (lef, top) {
    lef = lef < 150 ? lef = 150 : lef = lef;
    lef = lef < 250 ? lef = lef : lef = 250;
    top = top < 150 ? top = 150 : top = top;
    top = top < 250 ? top = top : top = 250;
    lef = lef - 150
    top = top - 150
    this.focus.style.left = lef + "px"
    this.focus.style.top = top + "px"
    this.big_img.style.left = -lef * parseInt(450 / 250) + 'px'
    this.big_img.style.top = -top * parseInt(450 / 250) + "px"
}
magnifier.prototype.bigposition = function () {
}
new magnifier().bindevent()

